<script>
import {Dropdown, DropdownItem, DropdownMenu, Icon, MenuItem} from "view-ui-plus";
import loginItem from "view-ui-plus/src/components/login/login-item.js";

    export default {
        name: "Nav",
      computed: {
        loginItem() {
          return loginItem
        }
      },
      components: {DropdownMenu, DropdownItem, Icon, Dropdown, MenuItem},
        data() {
            return {
                menu: [],
                index: 'Assetsys',
                theme1: 'light',
                userBtn: false,
              assetBtn: false,
              loginBtn:false,
              testBtn:false,
                username:'',
                name: ''
            }
        },
        created() {
            setInterval(() => {
                console.log("轮询")
                //    获取用户用户是否存在
                if (sessionStorage.getItem('name')) {
                    this.userBtn = true
                    this.username = sessionStorage.getItem('username')
                    this.name = sessionStorage.getItem('name')
                  if(sessionStorage.getItem('remark')==="平台管理员"){
                    this.testBtn = true
                    this.assetBtn = true
                  }
                  if(sessionStorage.getItem('remark')==='渗透测试员'){
                    this.testBtn = true
                    this.assetBtn = false
                  }
                  if(sessionStorage.getItem('remark')==='资产测试员'){
                    this.testBtn = false
                    this.assetBtn = true
                  }
                } else {
                    this.userBtn = false
                }

                this.adminBtn = sessionStorage.getItem('username') === 'admin';
            }, 3000)
        },
        updated() {
        },
        methods: {
            //用户退出
            exit() {
                console.log(sessionStorage.getItem('name'))
                sessionStorage.removeItem('name')
              sessionStorage.removeItem('username')
              sessionStorage.removeItem('remark')
                console.log(sessionStorage.getItem('name'))
              this.$Notice.info({
                title: '提示',
                desc: '成功退出'
              });
              this.$router.push({path: '/'})

            },
            goUrl(url) {
                this.$router.push({path: url})
            }
        }
    }
</script>

<template>
    <div>
        <Menu mode="horizontal" :theme="theme1" active-name="1">
            <MenuItem name="1">
                <div class="main">
                    <Icon type="md-book"/>
                    <router-link to="/">
                        {{index}}
                    </router-link>
                </div>
            </MenuItem>
            <MenuItem name="2">
                <Dropdown v-if="userBtn">
                    <a href="javascript:void(0)">
                        用户:{{name}}
                        <Icon type="arrow-down-b"></Icon>
                    </a>
                    <template #list>
                    <DropdownMenu >
                        <DropdownItem>
                            <div v-on:click="goUrl('/userInfo/'+username)">个人信息</div>
                        </DropdownItem>
                        <DropdownItem>
                            <div v-on:click="exit">退出</div>
                        </DropdownItem>
                    </DropdownMenu>
                </template>
                </Dropdown>
                <router-link v-if="!userBtn" :to="{ path: '/user/login'}">登录</router-link>
            </MenuItem>
            <MenuItem name="3" v-if="userBtn" >
              <div>
                <Dropdown v-if="assetBtn">
                  <a href="javascript:void(0)">
                    安全资产管理
                    <Icon type="arrow-down-b"></Icon>
                  </a>
                  <template #list>
                    <DropdownMenu >
                      <DropdownItem>
                        <div v-on:click="goUrl('/asset')">管理资产</div>
                      </DropdownItem>
                      <DropdownItem>
                        <div v-on:click="goUrl('/asset/queryName')">按照资产名称查询</div>
                      </DropdownItem>
                      <DropdownItem>
                        <div v-on:click="goUrl('/asset/queryCategory')">按照资产分类查询</div>
                      </DropdownItem>
                      <DropdownItem>
                        <div v-on:click="goUrl('/asset/queryLabel')">按照资产标签查询</div>
                      </DropdownItem>
                      <DropdownItem>
                        <div v-on:click="goUrl('/asset/queryOrg')">按照组织结构查询</div>
                      </DropdownItem>
                    </DropdownMenu>
                  </template>
                </Dropdown>
                <router-link v-if="!assetBtn" :to="{ path: '/assetUser'}">查看资产</router-link>
              </div>
            </MenuItem>
            <MenuItem name="4" v-if="assetBtn">
              <Dropdown v-if="assetBtn">
                <a href="javascript:void(0)">
                  组织机构管理
                  <Icon type="arrow-down-b"></Icon>
                </a>
                <template #list>
                  <DropdownMenu >
                    <DropdownItem>
                      <div v-on:click="goUrl('/organization')">管理机构</div>
                    </DropdownItem>
                    <DropdownItem>
                      <div v-on:click="goUrl('/organization/queryOrgName')">按照机构名字查询</div>
                    </DropdownItem>
                    <DropdownItem>
                      <div v-on:click="goUrl('/organization/queryFatherOrg')">按照所属父类查询</div>
                    </DropdownItem>
                  </DropdownMenu>
                </template>
              </Dropdown>
            </MenuItem>
            <MenuItem name="5" v-if="testBtn">
            <Dropdown v-if="assetBtn">
              <a href="javascript:void(0)">
                演练渗透任务管理
                <Icon type="arrow-down-b"></Icon>
              </a>
              <template #list>
                <DropdownMenu >
                  <DropdownItem>
                    <div v-on:click="goUrl('/task')">演练任务管理</div>
                  </DropdownItem>
                  <DropdownItem>
                    <div v-on:click="goUrl('/task/queryWord')">按照关键字查询</div>
                  </DropdownItem>
                  <DropdownItem>
                    <div v-on:click="goUrl('/task/queryStatus')">按照演练状态查询</div>
                  </DropdownItem>
                  <DropdownItem>
                    <div v-on:click="goUrl('/task/action')">演练任务操作</div>
                  </DropdownItem>
                </DropdownMenu>
              </template>
            </Dropdown>
          </MenuItem>
            <MenuItem name="6" v-if="testBtn">
            <Dropdown v-if="testBtn">
              <a href="javascript:void(0)">
                我的任务管理
                <Icon type="arrow-down-b"></Icon>
              </a>
              <template #list>
                <DropdownMenu >
                  <DropdownItem>
                    <div v-on:click="goUrl('/myTask')">我的任务列表</div>
                  </DropdownItem>
                  <DropdownItem>
                    <div v-on:click="goUrl('/vulnerabilityScan')">我的漏洞扫描</div>
                  </DropdownItem>
                  <DropdownItem>
                    <div v-on:click="goUrl('/exploitTask')">漏洞利用管理</div>
                  </DropdownItem>
                  <DropdownItem>
                    <div v-on:click="goUrl('/lateralMovement')">横向移动管理</div>
                  </DropdownItem>
                </DropdownMenu>
              </template>
            </Dropdown>
          </MenuItem>
     </Menu>
</div>
</template>
<style scoped>
    .main {
        font-weight: 600;
    }
    a {
        color: #2f2f2f;
    }
</style>
